<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>评分组件示例 - 橙红色图标</title>
</head>
<body >

<div style="max-width: 320px; border-radius: 4px; padding: 12px; background:#fff;">

    <!-- 第一行 -->
    <div style="display: flex; gap:8px; align-items: center; font-size: 14px; color: #363A44;">
        <div style="padding-left: 8px;">评分</div>
        <div style="display: inline-flex; align-items: center; color: #363A44; opacity: 0.4; cursor: pointer; gap: 4px; user-select:none;">
            查看评论明细
            <span style="font-style: normal; font-weight: bold;">›</span>
        </div>
    </div>

    <!-- 第二行 -->
    <div style="display: flex; justify-content: space-between; align-items: center; margin-top: 8px;">
        <div style="font-size: 24px; color: #333; font-weight: bold; padding-left: 8px;">4.5</div>
        <div style="color: #f39c12; font-size: 20px; user-select:none;">★★★★★</div>
    </div>

</div>






</body>
</html>
